import { useNavigate } from "umi";
import ItemCard from "@/components/ItemCard";
import { Card, Col, Flex, Row, Typography } from "antd";
import getLRUFunctionItem, { FunctionItem } from "@/services/home/home";

const { Text} = Typography;

/**
 * 响应式排列 移动端: 1列 平板：2列 pc 3/4列
 */

// 首页显示的内容


const Home = () => {
  const navigate = useNavigate()

  const handleClickItem = (item: any) => {
    if (item?.redirectUrl) {
      navigate(item.redirectUrl)
    }
  }
  
  return <>
    <Card 
      title="常用功能"
    >
    <Row gutter={[16, 16]}>
        {getLRUFunctionItem()?.map((item, idx) => {
        return <Col xs={24} sm={12} md={8} lg={6} xl={6} key={idx}>
        <ItemCard {...item} onClick={()=> {handleClickItem(item)}}></ItemCard>
        </Col>
        })}
    </Row>
    </Card>
    <Row>
        <Col xs={24} style={{padding: '16px'}}>
            <Flex justify="center">
                <Text type="secondary">
                    2024 白小屋 v1.0.0 | ©桂ICP备2024020518号-1
                </Text>
            </Flex>
        </Col>
    </Row>
  </>
}

export default Home;